<<<<<<< HEAD
<html>
    <head>
        <title>HTML 文档结构</title>
        <link rel="stylesheet" href="index.css"/>

    </head>
    <body style="color:darkorchid;">
        
        <div class="main">
            <div class="row">
             <input class="input" type="text" id ="inputtext" onkeyup="keyup(event)"/>
             <input type="button" name="bt" value="确认1" onclick="handleClick(event)"/>
             <input type="button" name="bt" id="button2" value="确认2" />
            </div>

            <div id="todogroup">
                <!--
                <div id="todo0"><input type="checkbox" name="todocheck">吃饭<button type="button" onclick="deleByIndex()">删除</button></div>
                <div>睡觉</div>
                -->

                <!-- 
                    todo项
                -->
            </div>
            
            <div id="xx" onmousemove="enter('xx')" onmouseout="leave('xx')">
                abcd&nbsp;&nbsp;acbd
             </div>

            <!-- <span style="color:blue">asd&nbsp;&nbsp;&nbsp;asd</span>     -->
        </div>


    </body>
    <script lang="javascript">
        var intCnt = 0 ;

        function init(){
            document.getElementById("button2").onclick = handleClick;
            //
        }

         function keyup(e){
             console.log(e);
            if(e.keyCode == 13){ 
            handleClick();
            }
         }

        // console.log('xxx');
        // document.getElementById("button2").onclick = handleClick;
        // console.log('xxxxxx');


        function handleClick(e){
            console.log('handleClick');
            console.log(e);

            var temp = getValue();

            // var temp = document.getElementById("inputtext");
            // console.log(temp.value);

            ////document.getElementById("todugroup").innerHTML = "<div>" + temp + "</div>"
           

            // var div = document.createElement('div');
            // div.innerText = temp;
            // document.getElementById("todogroup").append(div);
            
            // document.getElementById("todogroup").innerHTML += "<div id='todo"
            //  + intCnt + "'><input type='checkbox' name='todocheck'> "
            //  + temp +"<button type='button' onclick='deleByIndex("
            //  + intCnt + ")'>删除</button></div>"             ;

            document.getElementById("todogroup").innerHTML +="<div class='item' id='todo"
                + intCnt+"'><input type ='checkbox' name='todocheck'><div class='item-value'> "
                + temp+ "</div><button class='item-del' type='button' onclick='deletByIndex("
                + intCnt + ")'>删除</button></div>";
            document.getElementById("inputtext").value="";
            intCnt++;

            //document.getElementsByClassName("main")[0].style = "background-color: #333333;";
        }
        
        function getValue(){
            var temp = document.getElementById("inputtext");
            console.log(temp.value);
            return temp.value;
        }

        function deletByIndex(index){
            document.getElementById("todo"+index).remove();
        }

        function enter(id){
            document.getElementById(id).style='background-color:#3e3a3a'

        }
        function leave(id){
            document.getElementById(id).style='background-color:aliceblue'
        }
        

    </script>

    <style>

    body{
        display:flex;
        justify-content: center;
        align-items:center;
        min-height: 100vh;
        }
        .main{
        /* background-color: cyan;
        height: 200px; */
            padding: 8px;
            border:1px solid #333333;
            border-radius: 18px;
        }
        .row{
        display:flex; 
        }
        
        .item{
            display: flex;
            align-items: center;
            margin:6px;
            padding:3px;
        }
        .item-value{
            flex-grow: 1;
            color:#000000;

        }
        .item-del{
            color:aliceblue;

            background-color: red;

            border: 0px;
            
            opacity:0;
        }
        .item:hover .item-del{
            opacity: 1;
        }


        .input{
            padding: 8px;

            outline: none;
            border:2px solid #bbbbbb ;
        }
        .input:focus{
            box-shadow: 0px 0px 10px blue;
            border: 2px solid blue;
        }
    </style>
=======
<<<<<<< HEAD
<html>
    <head>
        <title>HTML 文档结构</title>
        <link rel="stylesheet" href="index.css"/>

    </head>
    <body style="color:darkorchid;">
        
        <div class="main">
            <div class="row">
             <input class="input" type="text" id ="inputtext" onkeyup="keyup(event)"/>
             <input type="button" name="bt" value="确认1" onclick="handleClick(event)"/>
             <input type="button" name="bt" id="button2" value="确认2" />
            </div>

            <div id="todogroup">
                <!--
                <div id="todo0"><input type="checkbox" name="todocheck">吃饭<button type="button" onclick="deleByIndex()">删除</button></div>
                <div>睡觉</div>
                -->

                <!-- 
                    todo项
                -->
            </div>
            
            <div id="xx" onmousemove="enter('xx')" onmouseout="leave('xx')">
                abcd&nbsp;&nbsp;acbd
             </div>

            <!-- <span style="color:blue">asd&nbsp;&nbsp;&nbsp;asd</span>     -->
        </div>


    </body>
    <script lang="javascript">
        var intCnt = 0 ;

        function init(){
            document.getElementById("button2").onclick = handleClick;
            //
        }

         function keyup(e){
             console.log(e);
            if(e.keyCode == 13){ 
            handleClick();
            }
         }

        // console.log('xxx');
        // document.getElementById("button2").onclick = handleClick;
        // console.log('xxxxxx');


        function handleClick(e){
            console.log('handleClick');
            console.log(e);

            var temp = getValue();

            // var temp = document.getElementById("inputtext");
            // console.log(temp.value);

            ////document.getElementById("todugroup").innerHTML = "<div>" + temp + "</div>"
           

            // var div = document.createElement('div');
            // div.innerText = temp;
            // document.getElementById("todogroup").append(div);
            
            // document.getElementById("todogroup").innerHTML += "<div id='todo"
            //  + intCnt + "'><input type='checkbox' name='todocheck'> "
            //  + temp +"<button type='button' onclick='deleByIndex("
            //  + intCnt + ")'>删除</button></div>"             ;

            document.getElementById("todogroup").innerHTML +="<div class='item' id='todo"
                + intCnt+"'><input type ='checkbox' name='todocheck'><div class='item-value'> "
                + temp+ "</div><button class='item-del' type='button' onclick='deletByIndex("
                + intCnt + ")'>删除</button></div>";
            document.getElementById("inputtext").value="";
            intCnt++;

            //document.getElementsByClassName("main")[0].style = "background-color: #333333;";
        }
        
        function getValue(){
            var temp = document.getElementById("inputtext");
            console.log(temp.value);
            return temp.value;
        }

        function deletByIndex(index){
            document.getElementById("todo"+index).remove();
        }

        function enter(id){
            document.getElementById(id).style='background-color:#3e3a3a'

        }
        function leave(id){
            document.getElementById(id).style='background-color:aliceblue'
        }
        

    </script>

    <style>

    body{
        display:flex;
        justify-content: center;
        align-items:center;
        min-height: 100vh;
        }
        .main{
        /* background-color: cyan;
        height: 200px; */
            padding: 8px;
            border:1px solid #333333;
            border-radius: 18px;
        }
        .row{
        display:flex; 
        }
        
        .item{
            display: flex;
            align-items: center;
            margin:6px;
            padding:3px;
        }
        .item-value{
            flex-grow: 1;
            color:#000000;

        }
        .item-del{
            color:aliceblue;

            background-color: red;

            border: 0px;
            
            opacity:0;
        }
        .item:hover .item-del{
            opacity: 1;
        }


        .input{
            padding: 8px;

            outline: none;
            border:2px solid #bbbbbb ;
        }
        .input:focus{
            box-shadow: 0px 0px 10px blue;
            border: 2px solid blue;
        }
    </style>
=======
<<<<<<< HEAD
=======
<<<<<<< HEAD
>>>>>>> d376503 (饶驿婷)
<html>
    <head>
        <title>HTML 文档结构</title>
        <link rel="stylesheet" href="index.css"/>

    </head>
    <body style="color:darkorchid;">
        
        <div class="main">
            <div class="row">
             <input class="input" type="text" id ="inputtext" onkeyup="keyup(event)"/>
             <input type="button" name="bt" value="确认1" onclick="handleClick(event)"/>
             <input type="button" name="bt" id="button2" value="确认2" />
            </div>

            <div id="todogroup">
                <!--
                <div id="todo0"><input type="checkbox" name="todocheck">吃饭<button type="button" onclick="deleByIndex()">删除</button></div>
                <div>睡觉</div>
                -->

                <!-- 
                    todo项
                -->
            </div>
            
            <div id="xx" onmousemove="enter('xx')" onmouseout="leave('xx')">
                abcd&nbsp;&nbsp;acbd
             </div>

            <!-- <span style="color:blue">asd&nbsp;&nbsp;&nbsp;asd</span>     -->
        </div>


    </body>
    <script lang="javascript">
        var intCnt = 0 ;

        function init(){
            document.getElementById("button2").onclick = handleClick;
            //
        }

         function keyup(e){
             console.log(e);
            if(e.keyCode == 13){ 
            handleClick();
            }
         }

        // console.log('xxx');
        // document.getElementById("button2").onclick = handleClick;
        // console.log('xxxxxx');


        function handleClick(e){
            console.log('handleClick');
            console.log(e);

            var temp = getValue();

            // var temp = document.getElementById("inputtext");
            // console.log(temp.value);

            ////document.getElementById("todugroup").innerHTML = "<div>" + temp + "</div>"
           

            // var div = document.createElement('div');
            // div.innerText = temp;
            // document.getElementById("todogroup").append(div);
            
            // document.getElementById("todogroup").innerHTML += "<div id='todo"
            //  + intCnt + "'><input type='checkbox' name='todocheck'> "
            //  + temp +"<button type='button' onclick='deleByIndex("
            //  + intCnt + ")'>删除</button></div>"             ;

            document.getElementById("todogroup").innerHTML +="<div class='item' id='todo"
                + intCnt+"'><input type ='checkbox' name='todocheck'><div class='item-value'> "
                + temp+ "</div><button class='item-del' type='button' onclick='deletByIndex("
                + intCnt + ")'>删除</button></div>";
            document.getElementById("inputtext").value="";
            intCnt++;

            //document.getElementsByClassName("main")[0].style = "background-color: #333333;";
        }
        
        function getValue(){
            var temp = document.getElementById("inputtext");
            console.log(temp.value);
            return temp.value;
        }

        function deletByIndex(index){
            document.getElementById("todo"+index).remove();
        }

        function enter(id){
            document.getElementById(id).style='background-color:#3e3a3a'

        }
        function leave(id){
            document.getElementById(id).style='background-color:aliceblue'
        }
        

    </script>

    <style>

    body{
        display:flex;
        justify-content: center;
        align-items:center;
        min-height: 100vh;
        }
        .main{
        /* background-color: cyan;
        height: 200px; */
            padding: 8px;
            border:1px solid #333333;
            border-radius: 18px;
        }
        .row{
        display:flex; 
        }
        
        .item{
            display: flex;
            align-items: center;
            margin:6px;
            padding:3px;
        }
        .item-value{
            flex-grow: 1;
            color:#000000;

        }
        .item-del{
            color:aliceblue;

            background-color: red;

            border: 0px;
            
            opacity:0;
        }
        .item:hover .item-del{
            opacity: 1;
        }


        .input{
            padding: 8px;

            outline: none;
            border:2px solid #bbbbbb ;
        }
        .input:focus{
            box-shadow: 0px 0px 10px blue;
            border: 2px solid blue;
        }
    </style>
<<<<<<< HEAD
=======
=======
<<<<<<< HEAD
<html>
    <head>
        <title>HTML 文档结构</title>
        <link rel="stylesheet" href="index.css"/>

    </head>
    <body style="color:darkorchid;">
        
        <div class="main">
            <div class="row">
             <input class="input" type="text" id ="inputtext" onkeyup="keyup(event)"/>
             <input type="button" name="bt" value="确认1" onclick="handleClick(event)"/>
             <input type="button" name="bt" id="button2" value="确认2" />
            </div>

            <div id="todogroup">
                <!--
                <div id="todo0"><input type="checkbox" name="todocheck">吃饭<button type="button" onclick="deleByIndex()">删除</button></div>
                <div>睡觉</div>
                -->

                <!-- 
                    todo项
                -->
            </div>
            
            <div id="xx" onmousemove="enter('xx')" onmouseout="leave('xx')">
                abcd&nbsp;&nbsp;acbd
             </div>

            <!-- <span style="color:blue">asd&nbsp;&nbsp;&nbsp;asd</span>     -->
        </div>


    </body>
    <script lang="javascript">
        var intCnt = 0 ;

        function init(){
            document.getElementById("button2").onclick = handleClick;
            //
        }

         function keyup(e){
             console.log(e);
            if(e.keyCode == 13){ 
            handleClick();
            }
         }

        // console.log('xxx');
        // document.getElementById("button2").onclick = handleClick;
        // console.log('xxxxxx');


        function handleClick(e){
            console.log('handleClick');
            console.log(e);

            var temp = getValue();

            // var temp = document.getElementById("inputtext");
            // console.log(temp.value);

            ////document.getElementById("todugroup").innerHTML = "<div>" + temp + "</div>"
           

            // var div = document.createElement('div');
            // div.innerText = temp;
            // document.getElementById("todogroup").append(div);
            
            // document.getElementById("todogroup").innerHTML += "<div id='todo"
            //  + intCnt + "'><input type='checkbox' name='todocheck'> "
            //  + temp +"<button type='button' onclick='deleByIndex("
            //  + intCnt + ")'>删除</button></div>"             ;

            document.getElementById("todogroup").innerHTML +="<div class='item' id='todo"
                + intCnt+"'><input type ='checkbox' name='todocheck'><div class='item-value'> "
                + temp+ "</div><button class='item-del' type='button' onclick='deletByIndex("
                + intCnt + ")'>删除</button></div>";
            document.getElementById("inputtext").value="";
            intCnt++;

            //document.getElementsByClassName("main")[0].style = "background-color: #333333;";
        }
        
        function getValue(){
            var temp = document.getElementById("inputtext");
            console.log(temp.value);
            return temp.value;
        }

        function deletByIndex(index){
            document.getElementById("todo"+index).remove();
        }

        function enter(id){
            document.getElementById(id).style='background-color:#3e3a3a'

        }
        function leave(id){
            document.getElementById(id).style='background-color:aliceblue'
        }
        

    </script>

    <style>

    body{
        display:flex;
        justify-content: center;
        align-items:center;
        min-height: 100vh;
        }
        .main{
        /* background-color: cyan;
        height: 200px; */
            padding: 8px;
            border:1px solid #333333;
            border-radius: 18px;
        }
        .row{
        display:flex; 
        }
        
        .item{
            display: flex;
            align-items: center;
            margin:6px;
            padding:3px;
        }
        .item-value{
            flex-grow: 1;
            color:#000000;

        }
        .item-del{
            color:aliceblue;

            background-color: red;

            border: 0px;
            
            opacity:0;
        }
        .item:hover .item-del{
            opacity: 1;
        }


        .input{
            padding: 8px;

            outline: none;
            border:2px solid #bbbbbb ;
        }
        .input:focus{
            box-shadow: 0px 0px 10px blue;
            border: 2px solid blue;
        }
    </style>
=======
<html>
    <head>
        <title>HTML 文档结构</title>
        <link rel="stylesheet" href="index.css"/>

    </head>
    <body style="color:darkorchid;">
        
        <div class="main">
            <div class="row">
             <input class="input" type="text" id ="inputtext" onkeyup="keyup(event)"/>
             <input type="button" name="bt" value="确认1" onclick="handleClick(event)"/>
             <input type="button" name="bt" id="button2" value="确认2" />
            </div>

            <div id="todogroup">
                <!--
                <div id="todo0"><input type="checkbox" name="todocheck">吃饭<button type="button" onclick="deleByIndex()">删除</button></div>
                <div>睡觉</div>
                -->

                <!-- 
                    todo项
                -->
            </div>
            
            <div id="xx" onmousemove="enter('xx')" onmouseout="leave('xx')">
                abcd&nbsp;&nbsp;acbd
             </div>

            <!-- <span style="color:blue">asd&nbsp;&nbsp;&nbsp;asd</span>     -->
        </div>


    </body>
    <script lang="javascript">
        var intCnt = 0 ;

        function init(){
            document.getElementById("button2").onclick = handleClick;
            //
        }

         function keyup(e){
             console.log(e);
            if(e.keyCode == 13){ 
            handleClick();
            }
         }

        // console.log('xxx');
        // document.getElementById("button2").onclick = handleClick;
        // console.log('xxxxxx');


        function handleClick(e){
            console.log('handleClick');
            console.log(e);

            var temp = getValue();

            // var temp = document.getElementById("inputtext");
            // console.log(temp.value);

            ////document.getElementById("todugroup").innerHTML = "<div>" + temp + "</div>"
           

            // var div = document.createElement('div');
            // div.innerText = temp;
            // document.getElementById("todogroup").append(div);
            
            // document.getElementById("todogroup").innerHTML += "<div id='todo"
            //  + intCnt + "'><input type='checkbox' name='todocheck'> "
            //  + temp +"<button type='button' onclick='deleByIndex("
            //  + intCnt + ")'>删除</button></div>"             ;

            document.getElementById("todogroup").innerHTML +="<div class='item' id='todo"
                + intCnt+"'><input type ='checkbox' name='todocheck'><div class='item-value'> "
                + temp+ "</div><button class='item-del' type='button' onclick='deletByIndex("
                + intCnt + ")'>删除</button></div>";
            document.getElementById("inputtext").value="";
            intCnt++;

            //document.getElementsByClassName("main")[0].style = "background-color: #333333;";
        }
        
        function getValue(){
            var temp = document.getElementById("inputtext");
            console.log(temp.value);
            return temp.value;
        }

        function deletByIndex(index){
            document.getElementById("todo"+index).remove();
        }

        function enter(id){
            document.getElementById(id).style='background-color:#3e3a3a'

        }
        function leave(id){
            document.getElementById(id).style='background-color:aliceblue'
        }
        

    </script>

    <style>

    body{
        display:flex;
        justify-content: center;
        align-items:center;
        min-height: 100vh;
        }
        .main{
        /* background-color: cyan;
        height: 200px; */
            padding: 8px;
            border:1px solid #333333;
            border-radius: 18px;
        }
        .row{
        display:flex; 
        }
        
        .item{
            display: flex;
            align-items: center;
            margin:6px;
            padding:3px;
        }
        .item-value{
            flex-grow: 1;
            color:#000000;

        }
        .item-del{
            color:aliceblue;

            background-color: red;

            border: 0px;
            
            opacity:0;
        }
        .item:hover .item-del{
            opacity: 1;
        }


        .input{
            padding: 8px;

            outline: none;
            border:2px solid #bbbbbb ;
        }
        .input:focus{
            box-shadow: 0px 0px 10px blue;
            border: 2px solid blue;
        }
    </style>
>>>>>>> 861c01f (饶驿婷)
>>>>>>> 4a7ce3a (饶驿婷)
>>>>>>> d376503 (饶驿婷)
>>>>>>> ceff70e (饶驿婷)
>>>>>>> f4551b3 (饶驿婷)
</html>